<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" href="../../css/mui.min.css" />
		<link rel="stylesheet" type="text/css" href="../../css/common.css" />
		<link rel="stylesheet" type="text/css" href="../../css/order/ordersubmit.css" />
		<style type="text/css">
			.shop_text>div {
				display: -webkit-box;
				display: -moz-box;
				display: -ms-flexbox;
				display: -webkit-flex;
				display: flex;
			}
			
			.nopadding {
				padding-bottom: 0;
			}
		</style>
	</head>

	<body>
		<div id="confirm" v-cloak v-show='userOrder'>
			<header class="mui-bar mui-bar-nav">
				<a class="mui-action-back mui-icon mui-icon-arrowleft mui-pull-left"></a>
				<h1 class="mui-title">订单详情</h1>
			</header>
			<div class="mui-content" :class="{nopadding : userOrder.status !=1}">
				<div id="submit" v-if="userOrder.status ==1">
					<div class="wait">
						<div class="wait_img"><img src="../../images/order_details.png" /></div>
						<div class="wait_text">
							<div>等待您付款</div>
							<div>{{cancelMinsText}}后订单自动关闭</div>
						</div>
					</div>
					<div class="user_info">
						<div class="user_img"><img src="../../images/position.png" /></div>
						<div class="user_data">
							<div class="user_msg">
								<div>收货人：{{userAddressSub.receiver}}</div>
								<div>{{userAddressSub.mobile}}</div>
							</div>
							<div class="position">收货地址：{{userAddressSub.detailAddress}}</div>
						</div>
					</div>
					<div class="order_data">
						<div class="shop_data" v-for="list in list">
							<div class="shop_img"><img :src="imgCommonUrl + list.pic" /></div>
							<div class="shop_text">
								<div>
									<div>{{list.prodName}}</div>
									<div>￥{{list.cash}}</div>
								</div>
								<div v-for="children in list.children">
									<div>{{children.attribute}}</div>
									<span>X{{children.basketCount}}</span>
								</div>
							</div>
						</div>
						<div class="order_msg">
							<div>订单编号：{{userOrder.subNum}}</div>
							<div>下单时间：{{userOrder.subDateStr}}</div>
							<!--<div>支付方式：银行卡</div>-->
						</div>
						<div class="order_sum">
							<div>卖家留言：{{userOrder.orderRemark}}</div>
							<div>
								<div>商品总额</div>
								<div>¥{{userOrder.total}}</div>
							</div>
							<div>
								<div>运费</div>
								<div>{{userOrder.freightAmount}}</div>
							</div>
							<div>
								<div>优惠金额</div>
								<div>￥{{userOrder.discountPrice}}</div>
							</div>
							<div>
								商品总金额：<span>¥{{userOrder.actualTotal}}</span>
							</div>
						</div>
					</div>
				</div>
				<!--已付款-->
				<div class="success" v-else>
					<div class="success_title">
						<div v-if="userOrder.status ==2">未发货</div>
						<div v-else-if="userOrder.status ==3">已发货</div>
						<div v-else-if="userOrder.status ==4">交易成功</div>
						<div v-else-if="userOrder.status ==5">交易关闭</div>
						<div class="order">订单号{{userOrder.subNum}}</div>
					</div>
					<div class="success_state">
						<div>
							<div class="success_Img">
								<img src="../../images/walletcheck.png" v-if="userOrder.status ==2" />
								<img src="../../images/wallets.png" v-else/>
							</div>
							<div :style="{color : userOrder.status ==2 ? '#f3bb8e' :'#333'}">付款成功</div>
						</div>
						<div class="zhuangshi"><img src="../../images/zhuangshi.png" /></div>
						<div>
							<div class="success_Img">
								<img src="../../images/etcCheck.png" v-if="userOrder.status ==3" />
								<img src="../../images/etc.png" v-else/>
							</div>
							<div :style="{color : userOrder.status ==3 ? '#f3bb8e' :'#333'}">配送中</div>
						</div>
						<div class="zhuangshi"><img src="../../images/zhuangshi.png" /></div>
						<div>
							<div class="success_Img">
								<img src="../../images/signcheck.png" v-if="userOrder.status==4" />
								<img src="../../images/sign.png" v-else/>
							</div>
							<div :style="{color : userOrder.status ==4 ? '#f3bb8e' :'#333'}">签收成功</div>
						</div>
					</div>
					<div class="success_order_data">
						<div>订单金额：￥{{userOrder.total}}</div>
						<div v-if="userOrder.payTypeId == 'COIN'">支付方式：金币支付</div>
						<div v-else-if="userOrder.payTypeId == 'PRED'">支付方式：余额支付</div>
						<div v-else-if="userOrder.payTypeId == 'WEIXIN_PAY_APP'">支付方式：微信支付</div>
						<div v-else-if="userOrder.payTypeId == 'ALP_APP'">支付方式：支付宝支付</div>
						<div v-else>支付方式：组合支付</div>

						<div>收获地址：{{userAddressSub.detailAddress}}</div>
						<div>收货人：{{userAddressSub.receiver}}</div>
						<div>收获电话：{{userAddressSub.mobile}}</div>
						<div>下单时间：{{userOrder.subDateStr}}</div>
						<div>卖家留言：{{userOrder.orderRemark}}</div>
					</div>
					<div class="success_order_details">
						<div class="success_order_detailsTitle">
							<div>商品信息</div>
							<div>共{{userOrder.productNums}}件</div>
						</div>
						<div class="shop_data" v-for="list in list">
							<div class="success_shop_img"><img :src="imgCommonUrl + list.pic" /></div>
							<div class="shop_msg">
								<div>
									<div class="shop_text">{{list.prodName}}</div>
									<div class="money">￥{{list.cash}}</div>
								</div>
								<div v-for="children in list.children">
									<div class="shop_spec">{{children.attribute}}</div>
									<div>X{{children.basketCount}}</div>
								</div>

							</div>
						</div>
					</div>
					<div class="success_footer">
						<div>
							<div>商品：￥{{userOrder.total}}</div>
							<div>运费：¥{{userOrder.freightAmount}}</div>
							<div>实付：¥{{userOrder.actualTotal}}</div>
						</div>
					</div>
				</div>

			</div>

			<div class="order_footer" v-if="userOrder.status ==1">
				<button type="button" class="mui-btn" @tap='cancel'>取消订单</button>
				<button type="button" class="mui-btn mui-btn-danger" @tap='submitOrder'>去付款</button>
			</div>
		</div>
		<script src="../../js/mui.min.js"></script>
		<script src="../../js/libs/zepto.js"></script>
		<script src="../../js/libs/vue.js"></script>
		<script src="../../js/libs/vue-lazyload.js"></script>
		<script src="../../js/common.js"></script>
		<script src="../../js/order/ordersubmit.js"></script>
	</body>

</html>